﻿<Page
    x:Class="Microsoft.PlayerFramework.Samples.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Microsoft.PlayerFramework.Samples"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    DataContext="{Binding DefaultViewModel, RelativeSource={RelativeSource Self}}"
    d:DataContext="{Binding Source={d:DesignData Source=../Microsoft.PlayerFramework.Samples.Shared/DataModel/SampleData.json, Type=data:SampleDataSource}}"
    xmlns:data="using:Microsoft.PlayerFramework.Samples.Data"
    mc:Ignorable="d">

    <Page.Resources>
        <ResourceDictionary>
            <ResourceDictionary.ThemeDictionaries>
                <ResourceDictionary x:Key="Default">
                    <ImageBrush x:Key="HubBackgroundImageBrush" ImageSource="Assets/HubBackground.png"/>
                </ResourceDictionary>
                <ResourceDictionary x:Key="HighContrast">
                    <ImageBrush x:Key="HubBackgroundImageBrush" ImageSource="{x:Null}"/>
                </ResourceDictionary>
            </ResourceDictionary.ThemeDictionaries>

            <!-- Grid-appropriate item template as seen in section 2 -->
            <DataTemplate x:Key="Standard200x180TileItemTemplate">
                <Grid Width="180">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>
                    <Border Background="{ThemeResource ListViewItemPlaceholderBackgroundThemeBrush}" Height="173" Width="173" Grid.Row="0" HorizontalAlignment="Left">
                        <Image Source="{Binding ImagePath}" Stretch="UniformToFill" AutomationProperties.Name="{Binding Title}" Height="173" Width="173"/>
                    </Border>
                    <TextBlock Text="{Binding Title}" Style="{ThemeResource BaseTextBlockStyle}" Typography.Capitals="SmallCaps" Grid.Row="1" Margin="0,12,0,0" IsTextScaleFactorEnabled="False"/>
                </Grid>
            </DataTemplate>

            <DataTemplate x:Key="StandardTripleLineItemTemplate">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>

                    <Border Background="{ThemeResource ListViewItemPlaceholderBackgroundThemeBrush}" Height="99" Width="99" Grid.Column="0" HorizontalAlignment="Left">
                        <Image Source="{Binding ImagePath}" Stretch="UniformToFill" AutomationProperties.Name="{Binding Title}" Height="99" Width="99"/>
                    </Border>
                    <StackPanel Grid.Column="1" Margin="12,0,0,0">
                        <TextBlock Text="{Binding Title}" Style="{ThemeResource ListViewItemTextBlockStyle}"/>
                        <TextBlock Text="{Binding Subtitle}" Style="{ThemeResource ListViewItemSubheaderTextBlockStyle}" />
                        <TextBlock Text="{Binding Description}" Style="{ThemeResource ListViewItemContentTextBlockStyle}"/>
                    </StackPanel>
                </Grid>
            </DataTemplate>

            <DataTemplate x:Key="StandardDoubleLineItemTemplate">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>

                    <Border Background="{ThemeResource ListViewItemPlaceholderBackgroundThemeBrush}" Height="99" Width="99" Grid.Column="0" HorizontalAlignment="Left">
                        <Image Source="{Binding ImagePath}" Stretch="UniformToFill" AutomationProperties.Name="{Binding Title}" Height="99" Width="99"/>
                    </Border>
                    <StackPanel Grid.Column="1" Margin="12,0,0,0">
                        <TextBlock Text="{Binding Title}" Style="{ThemeResource ListViewItemTextBlockStyle}"/>
                        <TextBlock Text="{Binding Subtitle}" Style="{ThemeResource ListViewItemContentTextBlockStyle}"/>
                    </StackPanel>
                </Grid>
            </DataTemplate>

            <CollectionViewSource
            x:Name="groupedItemsViewSource"
            Source="{Binding Groups}"/>
        </ResourceDictionary>
    </Page.Resources>

    <Grid x:Name="LayoutRoot">

        <Pivot x:Uid="Pivot" Title="MY APPLICATION" x:Name="pivot"
            ItemsSource="{Binding Source={StaticResource groupedItemsViewSource}}"
            CommonNavigationTransitionInfo.IsStaggerElement="True" 
               Margin="0,12,0,0">
            <Pivot.ItemTemplate>
                <DataTemplate>
                    <ListView
                    ItemsSource="{Binding Items}"
                    IsItemClickEnabled="True"
                    ItemClick="ItemView_ItemClick"
                    ContinuumNavigationTransitionInfo.ExitElementContainer="True"
                    Margin="12,0,0,0">
                        <ListView.ItemTemplate>
                            <DataTemplate>
                                <StackPanel Margin="0,0,0,24">
                                    <TextBlock
                                    Text="{Binding Title}"
                                    TextWrapping="WrapWholeWords"
                                    Pivot.SlideInAnimationGroup="1"
                                    CommonNavigationTransitionInfo.IsStaggerElement="True"
                                    Style="{ThemeResource ListViewItemTextBlockStyle}"/>
                                    <TextBlock
                                    Text="{Binding Description}"
                                    TextWrapping="WrapWholeWords"
                                    Pivot.SlideInAnimationGroup="2" 
                                    CommonNavigationTransitionInfo.IsStaggerElement="True" 
                                    Style="{ThemeResource ListViewItemContentTextBlockStyle}"/>
                                </StackPanel>
                            </DataTemplate>
                        </ListView.ItemTemplate>
                    </ListView>
                </DataTemplate>
            </Pivot.ItemTemplate>
        </Pivot>
    </Grid>
</Page>